<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 引入初始化css样式 -->
    <link rel="stylesheet" href="./css/base.css" />
    <!-- 引入自己要写的css样式 -->
    <link rel="stylesheet" href="./css/index.css" />
    <title>小米官网</title>
    <style>
        
        

        


    </style>
</head>
<body>
    <div class="box">
        <!-- 顶部导航 -->
        <div class="tou">
            <ul class="w">
                <li><a href="#">小米网</a></li>
                <li><a href="#">MIUI</a></li>
                <li><a href="#">米聊</a></li>
                <li><a href="#">游戏</a></li>
                <li><a href="#">多看阅读</a></li>
                <li><a href="#">云服务</a></li>
                <li><a href="#">小米网移动版</a></li>
                <li><a href="#">问题反馈</a></li>
                <li><a href="#" class="last">Select Region</a></li>
            </ul>
        </div>
        <!-- /头部 -->
        

        <!-- 导航栏 -->
        <div class="daohang w">
            <h1 class="logo"><img src="./images/logo.png" alt="" width="50px"></h1>
                <img class="chuan" src="./images/haidaoquannew.gif" alt="">
            <ul class="nav">
                
                <li><a href="#">小米手机</a></li>
                <li><a href="#">红米</a></li>
                <li><a href="#">平板</a></li>
                <li><a href="#">电视</a></li>
                <li><a href="#">盒子.影音</a></li>
                <li><a href="#">路由器</a></li>
                <li><a href="#">智能硬件</a></li>
                <li><a href="#">服务</a></li>
                <li><a href="#">社区</a></li>
            </ul>
        </div>
        <!-- /导航栏 -->
        <div style="clear:both ;"></div>

        <!-- 侧导航栏行 -->
        <div class="cedaohang w">
            <!-- 左侧导航栏 -->
            <div class="xiaodaohang w">
                <ul>
                    <li><a href="#">手机 平板 电话卡<span>&gt;</span></a></li>
                    <li><a href="#">电视 盒子<span>&gt;</span></a></li>
                    <li><a href="#">路由器 智能硬板<span>&gt;</span></a></li>
                    <li><a href="#">移动电源 插线板<span>&gt;</span></a></li>
                    <li><a href="#">耳机 音响<span>&gt;</span></a></li>
                    <li><a href="#">电池 储存卡<span>&gt;</span></a></li>
                    <li><a href="#">保护套 后盖<span>&gt;</span></a></li>
                    <li><a href="#">贴膜 其他配件<span>&gt;</span></a></li>
                    <li><a href="#">米兔 服装<span>&gt;</span></a></li>
                    <li><a href="#">箱包 其他周边<span>&gt;</span></a></li>
                </ul>
            </div>
            <!-- 右侧图片 -->
            <div class="datupian">
                <a href=""><img src="./images/banner.png" alt="" ></a>
            </div>
        </div>
        <!-- /侧导航栏行 -->
        <!-- 4个框 -->
        <div class="adv w">
            <ul>
                <li class="first"><a href=""><img src="./images/menu1.png" alt=""></a></li>
                <li><a href=""><img src="./images/menu2.jpg" height="170px" alt=""></a></li>
                <li><a href=""><img src="./images/menu3.jpg" height="170px" alt=""></a></li>
                <li><a href=""><img src="./images/menu4.jpg" height="170px" alt=""></a></li>
            </ul>
        </div>
        <!-- /4个框 -->


        <!--智能硬件 -->
        <div class="tec">
            <div class="tec-in w">
                <div class="tec-top w">
                    <span>智能硬件</span>
                    <a href="#">查看全部</a>
                </div>
                <div class="pro w">
                    <ul>
                        <li class="one"><a href=""><img src="./images/124d82cc-cfce-44ab-b711-28b21be81683.jpg" alt=""></a></li>
                        <li><a href=""><img src="./images/list01.png" alt=""></a></li>
                        <li><a href=""><img src="./images/list02.png" alt=""></a></li>
                        <li><a href=""><img src="./images/list03.png" alt=""></a></li>
                        <li><a href=""><img src="./images/list04.png" alt=""></a></li>
                        <li class="two"><a href=""><img src="./images/list05.png" alt=""></a></li>
                        <li class="two"><a href=""><img src="./images/list06.png" alt=""></a></li>
                        <li class="two"><a href=""><img src="./images/list07.png" alt=""></a></li>
                        <li class="two"><a href=""><img src="./images/list08.png" alt=""></a></li>
                    </ul>
                </div>
            </div>
            
            
        </div>

        <!-- 底部 -->
        <div class="up w">
            <div class="up1">
                <ul>
                    <li class="li1"><a href="">帮助中心</a></li>
                    <li><a href="">账号管理</a></li>
                    <li><a href="">购物指南</a></li>
                    <li><a href="">订单操作</a></li>
                </ul>
            </div>
            <div class="up1">
                <li class="li1"><a href="">服务支持</a></li>
                    <li><a href="">售后政策</a></li>
                    <li><a href="">自助服务</a></li>
                    <li><a href="">相关下载</a></li>
            </div>
            <div class="up1">
                <li class="li1"><a href="">线下门店</a></li>
                    <li><a href="">小米之家</a></li>
                    <li><a href="">服务网点</a></li>
                    <li><a href="">零售网点</a></li>
            </div>
            <div class="up1">
                <li class="li1"><a href="">关于小米</a></li>
                    <li><a href="">了解小米</a></li>
                    <li><a href="">加入小米</a></li>
                    <li><a href="">联系我们</a></li>
            </div>
            <div class="up1">
                <li class="li1"><a href="">关注我们</a></li>
                    <li><a href="">新浪微博</a></li>
                    <li><a href="">小米部落</a></li>
                    <li><a href="">官方微信</a></li>
            </div>
            <div class="up1">
                <li class="li1"><a href="">服务特色</a></li>
                    <li><a href="">F码通道</a></li>
                    <li><a href="">小米移动</a></li>
                    <li><a href="">防伪查询</a></li>
            </div>
            <!-- 右边电话 -->
            <div class="up2">
                <h1>400-100-5678</h1>
                <p>周一至周日8:00-18:00</p>
                <p>仅收市话费</p>
            </div>
        </div>
        <!-- 版权 -->
        <div class="banquan w">
            <div>
                <a href=""><img src="./images/logo.png" alt=""></a>
            </div>
            
            <div>
                <ul>
                    <li>小米网|MIUI|米聊|多看书城|小米路由器|视频电话|小米后院|小米天猫店|小米淘宝直营店|小米网盟|问题反馈|Select Region</li>
                    <li>&copy;mi.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2014]0059-0009号 </li>
                    <li>违法和不良信息举报电话：185-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</li>
                </ul>
            </div>
        </div>
        <!-- 最后一行文字 -->
        <div class="wenzi">
            <p>探索黑科技，小米为发烧而生</p>
        </div>
    </div>
</body>
</html>